import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter_bilibili/core/extension/int_extension.dart';
import 'package:flutter_bilibili/ui/pages/login/initialize_login.dart';
import 'package:flutter_bilibili/ui/shared/app_theme.dart';

import '../../../core/event_bus/event_bus.dart';
import '../../../core/service/request/space_acc_info_request.dart';
import '../../shared/image_assets.dart';
import 'login_agreement.dart';

class HYLoginContent extends StatelessWidget with InitializeLogin {
  @override
  Widget build(BuildContext context) {
    double screenWidth = MediaQuery.of(context).size.width;
    return Scaffold(
      appBar: AppBar(
        title: const Text(
          "手机号注册登录",
          style: TextStyle(fontSize: HYAppTheme.xSmallFontSize),
        ),
        actions: const [  ///右上角的密码登录
          Center(
              child: Text(
            "密码登录   ",
            style: TextStyle(fontSize: HYAppTheme.xxSmallFontSize),
          ))
        ],
      ),
      body: Column(
        children: [
          buildLoginImage(),  ///2233娘背景
          GestureDetector(
            child: buildLoginRegion(context),  ///所属地区
            onTap: () {
              HYRegionDialog(context);
            },
          ),
          buildLoginTel(context),  ///电话号码
          SizedBox(
            height: 15.px,
          ),
          TextButton(
            style: ButtonStyle(
              backgroundColor:
                  MaterialStateProperty.all(HYAppTheme.norTextColors),
              minimumSize:
                  MaterialStateProperty.all(Size(screenWidth - 30.px, 40.px)),
            ),
            onPressed: () {
              ///点击验证登录
              HYSpaceAccInfoRequest.getSpaceAccInfoData(243766934)
                  .then((value) {
                spaceAccInfoEventBus.fire(value);
                Navigator.of(context).pop();
              });
            },
            child: Text("验证登录"),
          ),
          SizedBox(
            height: 15.px,
          ),
          buildLoginAgreement()  ///用户协议部分
        ],
      ),
      resizeToAvoidBottomInset: false, ///防止键盘弹出超出边界
    );
  }

  //图片层
  Widget buildLoginImage() {
    return Stack(
      children: [
        Center(
            child: Image.asset(
              ImageAssets.bilibiliPNG,
          width: imageWidth,
          height: imageHeight,
        )),
        Positioned(
          child: Image.asset(ImageAssets.open22PNG),
          width: imageWidth,
          height: imageHeight,
          left: 0,
          bottom: 0,
        ),
        Positioned(
          child: Image.asset(ImageAssets.open33PNG),
          width: imageWidth,
          height: imageHeight,
          right: 0,
          bottom: 0,
        ),
      ],
    );
  }

  //地区
  Widget buildLoginRegion(BuildContext context) {
    return Stack(
      children: [
        Container(
          alignment: Alignment.centerLeft,
          child: Text(
            regionList[regionIndex].region,
            style: TextStyle(color: Colors.black),
          ),
          width: double.infinity,
          padding: EdgeInsets.symmetric(vertical: 10.px, horizontal: 15.px),
          decoration: BoxDecoration(
            color: Colors.white,
            border: Border(   ///底部设置边框
              bottom:
                  BorderSide(width: 1.px, color: Theme.of(context).canvasColor),
            ),
          ),
        ),
        Positioned(
            right: 15.px,
            top: 0,
            bottom: 0,
            child: Icon(
              Icons.arrow_forward_ios,
              size: 15.px,
            ))
      ],
    );
  }

  //手机号码/验证码
  Widget buildLoginTel(BuildContext context) {
    final usernameTextEditController = TextEditingController();
    final passwordTextEditController = TextEditingController();
    return Container(
      color: Colors.white,
      width: double.infinity,
      child: Column(
        children: [
          Container(
            padding: EdgeInsets.symmetric(vertical: 2.px, horizontal: 15.px),
            decoration: BoxDecoration(
              color: Colors.white,
              border: Border(
                bottom: BorderSide(
                    width: 2.px, color: Theme.of(context).canvasColor),
              ),
            ),
            child: Row(
              children: [
                Text(regionList[regionIndex].telNum),
                Expanded(
                  child: Container(
                    margin: EdgeInsets.only(left: 15.px),
                    child: TextField(
                      autofocus: true,
                      showCursor: true,
                      cursorColor: HYAppTheme.norTextColors,
                      controller: usernameTextEditController,
                      decoration: InputDecoration(
                          hintText: "请输入手机号码", border: InputBorder.none),
                    ),
                  ),
                ),
                Container(
                  decoration: BoxDecoration(
                    border: Border(
                      left: BorderSide(
                          width: 1.px, color: Theme.of(context).canvasColor),
                    ),
                  ),
                  padding: EdgeInsets.symmetric(horizontal: 10.px),
                  child: Text("获取验证码"),
                ),
              ],
            ),
          ),
          Container(
            padding: EdgeInsets.symmetric(vertical: 5.px, horizontal: 15.px),
            child: Row(
              children: [
                Text("验证码"),
                Expanded(
                  child: Container(
                    margin: EdgeInsets.only(left: 15.px),
                    child: TextField(
                      showCursor: true,
                      cursorColor: HYAppTheme.norTextColors,
                      controller: passwordTextEditController,
                      decoration: InputDecoration(
                          hintText: "请输入验证码", border: InputBorder.none),
                    ),
                  ),
                )
              ],
            ),
          ),
        ],
      ),
    );
  }

  HYRegionDialog(BuildContext context) async {
    List<Widget> widgets = [];
    for (int i = 0; i < regionList.length; i++) {
      widgets.add(TextButton(
        onPressed: () {
          regionIndex = i;
          Navigator.pop(context);
        },
        child: Text(
          regionList[i].region,
          style: TextStyle(color: Colors.black),
        ),
      ));
    }
    var regionDialog = await showDialog(
      context: context,
      builder: (context) {
        return SimpleDialog(
          title: Text(
            "地区",
            style: TextStyle(fontSize: HYAppTheme.xSmallFontSize, fontWeight: FontWeight.bold),
          ),
          children: widgets,
        );
      },
    );
    return regionDialog;
  }
}
